<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="UTF-8" />
<title>自定义广告模板</title>
<link rel="stylesheet" type="text/css" href="../Public/jquery-easyui-1.3.4/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../Public/jquery-easyui-1.3.4/themes/icon.css">
<script type="text/javascript" src="../Public/jquery-easyui-1.3.4/jquery.min.js"></script>
<script type="text/javascript" src="../Public/jquery-easyui-1.3.4/jquery.easyui.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	$('#mytable').datagrid({
		nowrap: false,
		striped: true,
		url:'<{:U("/Template/indexjson")}>',
		loadMsg:'数据正在加载，请稍候...',
		columns:[[
			{field:'table_id',checkbox:true},
			{field:'table_name',title:'自定义名称',width:150,align:"left"},
			{field:'table_value',title:'值',width:120,align:"left",formatter:function(value){
				return value;
			}},
			{field:'table_comments',title:'备注',width:120,align:"left",formatter:function(value){
				return value;
			}},
			{field:'table_tid',title:'操作',width:50,align:"left",formatter:function(value){
				return '<a href="javascript:previewWindow(\''+value+'\')">预览</span>';
			}}
		]],
		singleSelect:true,
		fit:true,
		pagination:true,
		pageSize:20,
		toolbar:[{
			text:'新增广告模板',
			iconCls:'icon-add',
			handler:addAction
		},'-',{
			text:'编辑广告模板',
			iconCls:'icon-edit',
			handler:editAction
		},'-',{
			text:'删除广告模板',
			iconCls:'icon-remove',
			handler:removeAction
		}]
	});
	
	
	

});

function addAction(){
	$("#form_name").val('');
	$("#form_value").val('');
	$("#form_comments").val('');
	$("#formWindow").window('setTitle','新增广告模板');
	$("#submit").unbind("click");
	$("#submit").bind("click",{action:"<{:U('add')}>"},checkSubmit);
	$("#formWindow").window('open');
	$("#myLayout").layout('resize');
}
function editAction(){
	var selected = $('#mytable').datagrid('getSelected');
	console.log( selected );
	if(!selected){
		$.messager.alert('错误消息','请先选择一个广告模板再编辑！','error');
	}else{
		$("#form_name").val(selected.table_name);
		$("#form_value").val(selected.table_value);
		$("#form_comments").val(selected.table_comments);
		try {
			$("#fontnums").val( selected.table_conf['fontnums']);
			$("#picnums").val( selected.table_conf['picnums']);
			$("#flashnums").val( selected.table_conf['flashnums']);
		}catch(e){}
		$("#formWindow").window('setTitle','编辑广告模板');
		$("#submit").unbind("click");
		$("#submit").bind("click",{action:"<{:U('edit')}>",form_id:selected.table_id},checkSubmit);
		$("#formWindow").window('open');
		$("#myLayout").layout('resize');
	}
}
function removeAction(){
	var selected = $('#mytable').datagrid('getSelected');
	if(!selected){
		$.messager.alert('错误消息','请先选择一个广告模板再删除！','error');
	}else{
		$.messager.confirm('提示消息','确认删除？',function(r){
			if(r){
				$.post('<{:U("remove")}>','form_id='+selected.table_id,function(data){
					if(data.status=='false'){
						$.messager.alert('错误消息',data.info,'error');
					}else{
						$.messager.alert('提示消息',data.info,'info',function(){
							$("#mytable").datagrid('reload');
						});
					}
				},"json");
			}
		});
	}
}
function closeForm(){
	$("#formWindow").window('close');
}
function checkSubmit(event){
	if(!$("#myForm").form('validate')){
		$.messager.alert('错误消息','请确保表单信息无误再提交！','error');
	}else{
		if($("#form_typeid").val()=='0'){
			$.messager.alert('错误消息','请选择广告模板类型！','error');
			return;
		}

		closeForm();
		$.post(event.data.action,$('#myForm').serialize()+'&form_id='+event.data.form_id,function(data){
			if(data.status=='false'){
				$.messager.alert('错误消息',data.info,'error');
			}else{
				$.messager.alert('提示消息',data.info,'info',function(){
					$("#mytable").datagrid('reload');
				});
			}
		},"json");
	
	}
}

function previewWindow (id){
	$("#myLayout2").load("index.php?s=/Template/preview/form_id/"+ id,function(){
		$("#previewWindow").window('open');
	});

}
</script>
</head>
<body class="easyui-layout">
<div region="center" title="广告设置-&gt;自定义广告模板">
<div class="easyui-layout" fit="true">
	<div region="center" border="true"><table id="mytable"></table></div>
</div>
</div>
<div id="previewWindow" class="easyui-window" title="预览广告模板" data-options="modal:true,closed:true,iconCls:'icon-save'" style="width:500px;height:350px;padding:10px;">
	<div class="easyui-layout" fit="true" id="myLayout2">
	</div>
</div>
<div id="formWindow" class="easyui-window" title="新增广告模板" minimizable="false" collapsible="false" maximizable="false" closed="true" modal="true" style="width:600px;height:450px;padding:0px;">
	<div class="easyui-layout" fit="true" id="myLayout">
		<div region="center" border="false">
		<form id="myForm" method="post" style="width:550px;height:400px;">
			<div class="easyui-tabs" fit="true" plain="true" border="false">
				<div title="基本信息" style="padding:15px;">
				<table>
					<tr><td>广告模板名称：</td><td><INPUT class="easyui-validatebox" required="true" missingMessage="广告模板名称不能为空" TYPE="text" NAME="form_name" id="form_name" style="width:250px"></td></tr>
					<tr><td>描述</td><td><textarea class="easyui-validatebox" NAME="form_comments" id="form_comments" style="width:250px;height:50px;"></textarea></td></tr>
					<tr><td colspan="2">广告元素数量</td></tr>
					<tr>
						<td>图片</td>
						<td><select id="picnums" name="conf[picnums]">
						<option value="0">0</option>
						<option value="1">1</option>
						<option value="2">2</option>
						<option value="3">3</option>
						<option value="4">4</option>
						<option value="5">5</option>
						<option value="6">6</option>
						<option value="7">7</option>
						<option value="8">8</option>
						<option value="9">9</option>
						<option value="10">10</option>
						</select></td>
					</tr>
					<tr>
						<td>文字</td>
						<td><select name="conf[fontnums]" id="fontnums">
						<option value="0">0</option>
						<option value="1">1</option>
						<option value="2">2</option>
						<option value="3">3</option>
						<option value="4">4</option>
						<option value="5">5</option>
						<option value="6">6</option>
						<option value="7">7</option>
						<option value="8">8</option>
						<option value="9">9</option>
						<option value="10">10</option>
						</select></td>
					</tr>
					<tr>
						<td>FLASH</td>
						<td><select name="conf[flashnums]" id="flashnums">
						<option value="0">0</option>
						<option value="1">1</option>
						<option value="2">2</option>
						<option value="3">3</option>
						<option value="4">4</option>
						<option value="5">5</option>
						<option value="6">6</option>
						<option value="7">7</option>
						<option value="8">8</option>
						<option value="9">9</option>
						<option value="10">10</option>
						</select>
						<div><input type="button" id="btnCreateTag"  value="生成标签>>"></div>
						</td>
					</tr>
				</table>
				</div>
			</div>
			<div region="south" border="false" style="text-align:right;height:30px;line-height:30px;">
				<a class="easyui-linkbutton" icon="icon-ok" href="javascript:void(0)" id="submit">确定</a>
				<a class="easyui-linkbutton" icon="icon-cancel" href="javascript:void(0)" onclick="closeForm()">取消</a>
				</div>
		</form>
		
		
		
	</div>
</div>

</body>
</html>